/**
 * 装车控制 -  道闸参数设置 - 弹窗
 * @author xiaoxujs
 */

import { FC, useEffect, useState } from "react";
import { Col, Form, Input, InputNumber, message, Modal, Radio, Row } from "antd";
import { ITlplTLaneGateParamUpdateForm, ITlplTLaneQueryGateParam } from "./type";
import { postTlplTLaneGateParamUpdate } from "./api";
import { useWindowFontSize } from "../../../../../assets/fun/Antd/configprovider";

const DaozhaSetModule: FC<{
    open: boolean,
    handleSetCallback: () => void;
    clickData?: ITlplTLaneQueryGateParam,
    laneId?: string; // 装车站ID
}> = ({
    open,
    handleSetCallback,
    clickData,
    laneId,
}) => {
        const [form] = Form.useForm<ITlplTLaneGateParamUpdateForm>();
        const [loading, setLoading] = useState(false);
        useEffect(() => {
            if (clickData) {
                form.setFieldsValue(clickData)
            }
        }, [clickData, form])
        const handleOk = async () => {
            const values = await form.validateFields();
            if (clickData) {
                setLoading(true);
                const { code, msg } = await postTlplTLaneGateParamUpdate({
                    ...values,
                    id: laneId,
                }) as { code: number; msg: string };
                if (code === 20000) {
                    form.resetFields();
                    handleSetCallback();
                } else {
                    message.error(msg)
                }
                setLoading(false)

            }

        };
        const handleCancel = () => {
            handleSetCallback();
        };
        return <Modal title='设置道闸参数' width={useWindowFontSize(904)} confirmLoading={loading} open={open} onOk={handleOk} onCancel={handleCancel}>
            <Form
                labelCol={{ span: 8}}
                wrapperCol={{ span:14 }}
                form={form}
            >
                <Row gutter={24}>
                    <Col span={12} >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="名称"
                            name="gateName"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <Input />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="设备序列号"
                            name="gateNum"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <Input />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="设备IP地址"
                            name="gateIp"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <Input />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="设备SDK端口号"
                            name="gatePort"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <InputNumber max={65535} style={{ width: '100%' }} />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="设备SDK用户名"
                            name="gateUsername"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <Input />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="设备SDK密码"
                            name="gatePassword"
                            rules={[{ required: true, message: '请输入' }]}
                        >
                            <Input />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="入口道闸IO输入端口"
                            name="gateInPort"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <InputNumber style={{ width: '100%' }} min={0} max={10000} />
                        </Form.Item>
                    </Col>
                    <Col span={12}  >
                        <Form.Item<ITlplTLaneGateParamUpdateForm>
                            label="出口道闸IO输入端口"
                            name="gateOutPort"
                            rules={[{ required: true, message: '请输入!' }]}
                        >
                            <InputNumber style={{ width: '100%' }} min={0} max={10000} />
                        </Form.Item>
                    </Col>
                </Row>







            </Form>
        </Modal>
    }

export default DaozhaSetModule;